<template>
  <!-- 采样周期 -->
  <view class="sampling">
    <pane-card v-for="(item, index) in samplingInfo" :key="index" :title="item.title" :subTitle="`采样日期：${item.date}`" :tag="getTag(item.result)" :tagError="item.result === 2">
      <text slot="header" :class="{ error: !item.result }">{{ item.result ? '已完成' : '未完成' }}</text>
    </pane-card>
    <v-empty :isShow="showEmpty" text="暂无相关记录"></v-empty>
  </view>
</template>
<script>
  import PaneCard from '@/components/m-card/pane-card.vue';
  import VEmpty from '@/components/v-empty/index.vue';
  import Api from '@/api/main';
  export default {
    components: {
      PaneCard,
      VEmpty
    },
    data() {
      return {
        showEmpty: false,
        samplingInfo: [
          // {
          //   id: 1,
          //   title: '第一次采样',
          //   date: '2021/01/03 10:44',
          //   result: 0
          // },
          // {
          //   id: 2,
          //   title: '第二次采样',
          //   date: '2021/01/03 10:44',
          //   result: 1
          // },
          // {
          //   id: 3,
          //   title: '第三次采样',
          //   date: '2021/01/03 10:44',
          //   result: 2
          // }
        ]
      };
    },
    methods: {
      getTag(result) {
        if (!result) {
          return '';
        }
        if (result === 1) {
          return '阴性';
        }
        if (result === 2) {
          return '阳性';
        }
      },
      async getList() {
        const res = await this.$http.post(Api.getSamplingInfo);
        if (res) {
          this.samplingInfo = res;
          this.showEmpty = !this.samplingInfo.length
        }
      }
    },
    async onShow() {
      uni.showLoading({
        title: '加载中...'
      });
      await this.getList();
      uni.hideLoading();
    }
  };
</script>
<style lang="scss">
  .sampling {
    width: 100%;
    padding: 20rpx 40rpx;

    .error {
      color: $uni-color-error;
    }
  }
</style>